<template>
  <div class="cart">
    <div class="header">
      <van-nav-bar title="确定下单" fixed left-text="返回" right-text left-arrow @click-left="goBack"/>
    </div>
    <!--没有地址跳转显示-->
    <div class="cart_address">
      <div class="cart_address_con">
        {{userAddress.name}}
        <span>{{userAddress.phone}}</span>
      </div>
      <div class="addressText">
        <van-icon name="location-o"/>
        <span>{{userAddress.province}}{{userAddress.city}}{{userAddress.county}}{{userAddress.detailed}}</span>
      </div>
    </div>
    <div class="cart_shop">
      <div class="cart_shop_name">{{initdata.shop_Name}}</div>
      <div class="cart_shop_car">
        <div class="cart_shop_car_img">
          <img :src="initdata.product_image_url">
        </div>
        <div class="cart_shop_car_detail">
          <div class="cart_shop_car_detail_title">{{initdata.project_name}}</div>
          <div class="cart_shop_car_detail_data">
            <div class="cart_shop_car_detail_data_div">{{initdata.introduction}}</div>
            <div class="cart_shop_car_detail_data_div1">￥{{initdata.unit_price}}</div>
          </div>
        </div>
      </div>

      <div class="cart_number_element1">
        <div class="number_element1_num">购买数量</div>
        <div class="cart_number_element1_right2">
          <div @click="delete_number()" class="add_del_botton1">-</div>
          <input type="text" name="input1" :value="num" readonly="true">
          <div @click="add_number()" class="add_del_botton1">+</div>
        </div>
      </div>
      <!-- <div class="cart_number_element1">
        <div class="number_element1_num">运费</div>
        <div class="cart_number_element1_right1">￥{{Freight.data||'0'}}</div>
      </div>-->
    </div>
    <div class="cart_textarea">
      <p>备注</p>
      <textarea placeholder="请输入备注信息" rows="4" cols="48" v-model.trim="Remarks"></textarea>
    </div>
    <div class="cart_buttom-show">
      <div class="cart_bottom-item-button">
        <p>
          总价：
          <span style="color: red">￥{{total}}</span>
        </p>
      </div>
      <div class="cart_bottom-item-button1">
        <button @click="submit">立即支付</button>
      </div>
    </div>
  </div>
</template>
<script>
// import {getCookie, setCookie,authorLogin} from "../../utils/util";
export default {
  name: "confirmOrder",
  data() {
    return {
      Remarks: "",
      initdata: JSON.parse(this.$route.query.data),
      num: this.$route.query.num,
      total: 0,
      user_id: "",
      userAddress: "",
      orderId:''
    };
  },
  mounted: function() {
    if (this.initdata && this.num) {
      this.total = Number(this.initdata.unit_price * this.num).toFixed(2);
    }
    this.user_id =
      this.$cookies.get("user_id") || localStorage.getItem("user_id") || 10199;
    //生命周期
    this.getUserAddress();
  },

  methods: {
    //返回
    goBack() {
      this.$router.back();
    },
    //跳转用户地址
    linkAddress() {
      this.$router.push({ path: "/Address" });
    },
    // 调用用户地址
    async getUserAddress() {
      let params = {
        user_id: this.user_id
      };
      const res = await this.$axios.post(this.$api.UserAddressByUserId, params);
      if (res.success) {
        this.userAddress = res.data;
      }
    },

    //点击数量增加
    add_number() {
      if (this.restrict_count == this.num) {
        return;
      } else {
        this.num = Number(this.num) + 1;
      }
      if (this.initdata && this.num) {
        this.total = Number(this.initdata.unit_price * this.num).toFixed(2);
      }
    },
    //点击数量减掉
    delete_number() {
      if (this.num == 1) {
        return;
      } else {
        this.num = Number(this.num) - 1;
      }
      if (this.initdata && this.num) {
        this.total = Number(this.initdata.unit_price * this.num).toFixed(2);
      }
    },
    async submit() {
      var token = this.$cookies.get("token") || localStorage.getItem("token");
      let u = navigator.userAgent;
      let isAndroid = u.indexOf("Android") > -1 || u.indexOf("Adr") > -1; //android终端
      let isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
      if (!token) {
        if (isAndroid) {
          console.warn("ecologylogin");
        } else if (isiOS) {
          window.webkit.messageHandlers.goBackLogin.postMessage(null);
        }
      }
      let params = {
        crowd_Id: this.initdata.crowd_Id,
        quantity: this.num,
        shippingAddressId: this.userAddress.id,
        buyerMessage: this.Remarks
      };
      const res = await this.$axios.post(this.$api.crowd_submitOrder, params);
      if (res.success) {
        if (res.code == -1) {
          this.$dialog
            .confirm({
              title: "提示",
              message:
                "请前往认证投资人信息，才能查看投资更多项目信息，是否立即认证？",
              confirmButtonText: "立即认证"
            })
            .then(() => {
              this.$router.push({ path: "/bankCardInfo" });
            })
            .catch(() => {
              // on cancel
            });
        } else {
          this.orderId = res.data.order_num;
          let message = {
            orderId: this.orderId
          };
          if (isAndroid) {
            console.warn("pay:" + this.orderId);
          } else if (isiOS) {
            window.webkit.messageHandlers.toPayMethod.postMessage(message);
          }
        }
      } else {
        this.initData = {};
        this.$toast(res.msg);
      }
    }
  }
};
</script>
 
<style scoped>
.addressText {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  margin-top: 0.08rem;
}
.mint-radio-input:checked + .mint-radio-core {
  background-color: #01bf47 !important;
  border-color: #01bf47 !important;
}
.cart {
  width: 100%;
  height: 100%;
  background-color: #efefef;
}
.cart_address {
  background-color: #fff;
  overflow: hidden;
  padding: 0.56rem 0.2rem 0.2rem;
  margin-bottom: 0.05rem;
}
.cart_address i {
  font-size: 0.2rem;
  width: 8%;
}
.cart_address_con {
  width: 100%;
  padding-left: 0.3rem;
}
.cart_address_con p {
  font-size: 0.14rem;
}
.cart_address_con span {
  font-size: 0.14rem;
  color: grey;
  padding-left: 0.4rem;
}
.cart_shop {
  width: 100%;
  background-color: #fff;
}
.cart_shop_name {
  font-size: 0.12rem;
  padding-left: 0.2rem;
  line-height: 0.8rem;
}
.cart_shop_car {
  width: 100%;
  background-color: ghostwhite;
  overflow: hidden;
}
.cart_shop_car_img {
  width: 20%;
  float: left;
  margin: 0.2rem;
  height: 0.8rem;
}
.cart_shop_car_img img {
  width: 100%;
  height: 100%;
}
.cart_shop_car_detail {
  width: 65%;
  float: left;
  margin: 0.2rem 0 0.2rem 0;
}
.cart_shop_car_detail_title {
  font-size: 0.14rem;
  padding: 0.1rem 0 0;
}
.cart_shop_car_detail_data_div {
  font-size: 0.14rem;
  color: grey;
  padding-top: 0.1rem;
}
.cart_shop_car_detail_data_div1 {
  font-size: 0.14rem;
  color: red;
  padding-top: 0.1rem;
}
.cart_number_element1 {
  width: 100%;
  background-color: #fff;
  border-bottom: 1px solid ghostwhite;
  font-size: 0.14rem;
  padding: 0.1rem 0;
  overflow: hidden;
}
.number_element1_num {
  display: inline-block;
  float: left;
  width: 46%;
  padding-left: 0.2rem;
}
.cart_number_element1_right {
  display: inline-block;
  float: right;
  width: 38%;
  overflow: hidden;
  padding-right: 0.2rem;
  text-align: right;
}
.cart_number_element1_right1 {
  display: inline-block;
  float: right;
  width: 38%;
  overflow: hidden;
  padding-right: 0.2rem;
  text-align: right;
}
.cart_number_element1_right2 {
  float: right;
}
.cart_number_element1_right2 .add_del_botton1 {
  display: inline-block;
  float: left;
  width: 0.5rem;
  height: 0.5rem;
  background-color: #f0f0f0;
  color: #000;
  text-align: center;
  line-height: 0.5rem;
  margin-right: 0.2rem;
}
.cart_number_element1_right2 input {
  width: 0.3rem;
  font-size: 0.14rem;
  float: left;
  margin-right: 0.2rem;
  text-align: center;
  border: 0;
  padding-top: 0.05rem;
}
.cart_number_element1_right2 .add_del_botton1 {
  display: inline-block;
  float: left;
  width: 0.25rem;
  height: 0.25rem;
  background-color: #f0f0f0;
  color: #000;
  text-align: center;
  line-height: 0.25rem;
}
.cart_textarea {
  width: 100%;
  background-color: #fff;
  margin: 0.05rem 0;
  padding: 0 0.2rem 0.2rem;
}
.cart_textarea p {
  padding: 0.1rem 0rem;
  font-size: 0.14rem;
  border-bottom: 1px solid ghostwhite;
}
.cart_textarea textarea {
  font-size: 0.14rem;
  color: #01bf47;
  padding: 0.1rem;
  width: 100%;
}
.cart_xuanzhe {
  width: 100%;
  background-color: #fff;
  margin-top: 0.2rem;
  overflow: hidden;
  margin-bottom: 1rem;
}
.cart_xuanzhe p {
  font-size: 0.4rem;
  padding: 0.3rem 0.4rem;
}
.cart_buttom-show {
  position: fixed;
  bottom: 0;
  background-color: #fff;
  overflow: hidden;
  width: 100%;
  left: 0;
}
.cart_bottom-item-button {
  width: 60%;
  float: left;
  font-size: 0.4rem;
}
.cart_bottom-item-button p {
  font-size: 0.14rem;
  line-height: 0.5rem;
  padding-left: 0.2rem;
}
.cart_bottom-item-button1 {
  width: 40%;
  float: left;
  font-size: 0.3rem;
}
.cart_bottom-item-button1 button {
  float: right;
  font-size: 0.14rem;
  color: #fff;
  padding: 0 0.3rem;
  border: 0;
  line-height: 0.5rem;
  background-color: #01bf47;
}
</style>

